<template>
  <div class="index clearafter">
    <module-head></module-head>
    <div class="content flex">
      <div class="w220">
        <menu-list></menu-list>
      </div>
      <div class="w980 flex_full">
        <div class="flex flex_between">
          <p class="flex flex_vcenter pdb20">
            <i class="titleTag"></i>
            <span class="fRedBig">随访推送</span>
          </p>
          <p class="circleBtn" @click="openEditDay()">提前
            <span class="redFont">{{preDay}}天</span>
            推送</p>
        </div>

        <div class="whiteBg">
          <div class="flex">
            <div class="searchBox flex flex_vcenter">
              <label for="exampleInputEmai3">随访科室</label>
              <input type="text" class="form-control" id="exampleInputEmai3" v-model="deptText">
              <ul v-show="searchDeptList.length != 0">
                <li v-for="item in searchDeptList" @click="selSearchDept(item)">{{item.deptName}}</li>
              </ul>
            </div>
            <button class="yellowBtn ml20" @click="queryVisitManage(selSearchDeptName.localDeptId)">查询</button>
          </div>

          <table class="table table-striped table-hover">
            <thead>
            <tr>
              <th>随访方式</th>
              <th>随访日期</th>
              <th>状态</th>
              <th>随访时段</th>
              <th>联系电话</th>
              <th>姓名</th>
              <th>性别</th>
              <th>年龄</th>
              <th>出院科室</th>
              <th>出院时间</th>
              <th>主管医生</th>
              <th>出院主诊断</th>
              <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <!--v-if="item.SFKS != 0"-->
            <tr v-for="item in tableData">
              <td>{{item.SFFS | sffs}}</td>
              <td>{{item.SFSJ | timeStr}}</td>
              <td>{{item.JHZT | jhzt}}</td>
              <td></td>
              <td></td>
              <td>{{item.patient.BRXM}}</td>
              <td>{{item.patient.BRXB | sex}}</td>
              <td>{{item.patient.CSNY | old}}</td>
              <td>{{item.patient.BRKSVALUE}}</td>
              <td>{{item.patient.CYRQ.slice(0,11)}}</td>
              <td></td>
              <td></td>
              <td>
                <span title="调整" @click="toVisit(item)" v-if="item.JHZT == 0">
                  <img src="../../assets/img/jsszy/随访1.png" alt="" class="xicon">
                </span>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
    <div class="modal fade" tabindex="-1" role="dialog" id="editRuleModal">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">随访明细计划编辑</h4>
          </div>
          <div class="modal-body">
            <ul class="formList">
              <li>
                <label>随访名称</label>
                <input type="text" class="form-control" v-model="editParam.SFMC">
              </li>
              <li>
                <label>随访日期</label>
                <input type="text" placeholder="请选择开始日期" class="form-control" id="editstartdate" v-model="editParam.SFSJ" />
              </li>
              <li>
                <label>随访方式</label>
                <select class="form-control" v-model="editParam.SFFS">
                  <option value="1">电话随访</option>
                  <option value="2">当面随访</option>
                  <option value="3">视频随访</option>
                </select>
              </li>
              <li>
                <label>随访问卷</label>
                <select class="form-control" v-model="editPaper">
                  <option v-for="item in paperList" :value="item">{{item.YSMC}}</option>
                </select>
              </li>
            </ul>
          </div>
          <div class="modal-footer">
            <button class="longBtn center-block" @click="saveEdit()">保 存</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
    <div class="modal fade" tabindex="-1" role="dialog" id="editDayModal">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">编辑推送时间</h4>
          </div>
          <div class="modal-body">
            <p><span>提前</span><input type="text" v-model="preDay" class="xinput"><span>天推送</span></p>
          </div>
          <div class="modal-footer">
            <button class="longBtn center-block" @click="saveDay()">保 存</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
  </div>
</template>

<script>
  import Public from 'assets/public.js'
  import 'assets/lib/laydate/laydate.js'
  import 'assets/lib/laydate/need/laydate.css'
  import 'assets/lib/laydate/skins/danlan/laydate.css'
  import moduleHead from 'components/module-head'
  import menuList from 'components/menu-list'
  import 'assets/lib/bootstrap-3.3.2/js/bootstrap.min.js'
  export default {
    data () {
      return {
        localDeptId: '',
        tableData: [],
        deptText: '',
        searchDeptList: [],
        userSelEvent: false,
        selSearchDeptName: {},
        editParam: {},
        editPaper: {},
        paperList: [],
        preDay: ''
      }
    },
    components: {
      moduleHead, menuList
    },
    filters: {
      'sffs' (val) {
        if (val == 1) {
          return '电话随访'
        } else if (val == 2) {
          return '当面随访'
        } else if (val == 3) {
          return '视频随访'
        }
      },
      'SFZL' (val) {
        if (val == 1) {
          return '慢病随访'
        } else if (val == 2) {
          return '出院普通随访'
        }else if (val == 3) {
          return '门诊普通随访'
        }
      },
      'sex' (val) {
        if (val == 1) {
          return '男'
        } else if (val == 2) {
          return '女'
        } else {
          return '不详'
        }
      },
      'old' (val) {
        if (val) {
          var year = val.slice(0,4)
          return new Date().getFullYear()-year
        }
      },
      'jhzt' (val) {
        if (val == 0) {
          return '待随访'
        } else if (val == 1){
          return '已随访'
        } else {
          return '作废'
        }
      },
      'timeStr' (val) {
        var time = new Date(val)
        var result = this.formatDate(time)
        return result
      }
    },
    ready () {
      var self = this
      this.queryIllList()
      this.queryPaperList()
      this.getDate()
      laydate({
        elem: '#editstartdate',
        choose: function(datas) { //选择日期完毕的回调
          self.editParam.SFSJ = datas
        }
      })
    },
    watch: {
      'deptText' (val, oldval) {
        if (this.userSelEvent == false) {
          this.queryDept()
        } else {
          this.userSelEvent = false
        }
      }
    },
    methods: {
      queryPaperList () {
        var self = this
        $.ajax({
          type:"POST",
          url:Public.sfBaseUrl+"/NIS/cas/mobile/evaluation/v56_update1/get/styleList",
          headers: {
            "token": sessionStorage.getItem('sfToken')
          },
          data:{
            jgid: '1'
          },
          success:function(res){
            if (res.Data) {
              self.paperList = res.Data
            }
          }
        })
      },
      formatDate (now) {
        var year=now.getFullYear();
        var month=now.getMonth()+1;
        if (month<10) {
          month = '0'+month
        }
        var date=now.getDate()
        if (date<10) {
          date = '0'+date
        }
        return year+"-"+month+"-"+date;
      },
      queryIllList () {
        var self = this
        $.when(Public.commonajaxSf("cas.doctorCerfService", "findDeptbyDeptid", JSON.stringify([sessionStorage.getItem('docDept')])))
          .done(function(res) {
            if (res.code == 200) {
              self.localDeptId = res.body.localDeptId
              self.queryVisitManage(self.localDeptId)
            }
          })
      },
      queryVisitManage (deptId) {
        var self = this
        $.ajax({
          type:"POST",
          url:Public.sfBaseUrl+"/NIS/cas/mobile/evaluation/v56_update1/get/planlist",
          headers: {
            "token": sessionStorage.getItem('sfToken')
          },
          data:{
            SFKS: deptId,
            TODAY: new Date()
          },
          success:function(res){
            if (res.Data) {
              self.tableData = res.Data
            }
          }
        })
      },
      getDate () {
        var self = this
        $.ajax({
          type:"POST",
          url:Public.sfBaseUrl+"/NIS/getday",
          headers: {
            "token": sessionStorage.getItem('sfToken')
          },
          data:{

          },
          success:function(res){
            if (res.Data) {
              self.preDay =res.Data
            }
          }
        })
      },
      saveDay () {
        var self = this
        if (typeof (parseInt(this.preDay)) != 'number') {
          Public.ajaxPrompt('请输入整数')
          return
        }
        $.ajax({
          type:"POST",
          url:Public.sfBaseUrl+"/NIS/updateday",
          headers: {
            "token": sessionStorage.getItem('sfToken')
          },
          data:{
            day: self.preDay
          },
          success:function(res){
            if (res.Data == 1) {
              Public.ajaxPrompt('保存成功')
              $('#editDayModal').modal('hide')
            }
          }
        })
      },
      selSearchDept (item) {
        this.selSearchDeptName = item
        this.searchDeptList = []
        this.deptText = item.deptName
        this.userSelEvent = true
      },
      queryDept () {
        var self = this
        var param = this.deptText
        $.when(Public.commonajaxSf("cas.doctorCerfService", "findDeptlike", JSON.stringify(['0ab18621-cc00-4c4a-9b35-4ff28a7d9bcc', param])))
          .done(function(res) {
            if (res.code == 200) {
              self.searchDeptList = res.body
            }
          })
      },
      toVisit (item) {
        $('#editRuleModal').modal('show')
        this.editParam = item
        this.editParam.SFSJ = this.formatDate(new Date(this.editParam.SFSJ))
        for (var i = 0; i < this.paperList.length; i++) {
          if (item.YSXH == this.paperList[i].YSXH && item.BBH == this.paperList[i].BBH) {
            this.editPaper = this.paperList[i]
          }
        }
      },
      saveEdit () {
        var self = this
        this.editParam.YSXH = this.editPaper.YSXH
        this.editParam.BBH = this.editPaper.BBH
        this.editParam.YSMC = this.editPaper.YSMC
        var postdata= this.editParam
        $.ajax({
          type:"POST",
          url:Public.sfBaseUrl+"/NIS/cas/mobile/evaluation/v56_update1/edit/plan",
          headers: {
            "token": sessionStorage.getItem('sfToken')
          },
          contentType: 'application/json',
          data:JSON.stringify(postdata),
          beforeSend: function (req) {
            req.setRequestHeader("Accept", "application/json");
          },
          success:function(res){
            if (res.Data) {
              Public.ajaxPrompt('保存成功')
              $('#editRuleModal').modal('hide')
              self.queryVisitManage()
            }
          }
        })
      },
      openEditDay () {
        $('#editDayModal').modal('show')
      }
    }
  }
</script>

<style scoped>
  @import '../../assets/reset.css';
  @import '../../assets/flex.css';
  @import '../../assets/lib/bootstrap-3.3.2/css/bootstrap.min.css';
  .xinput{
    border:1px solid #eee;
    border-radius: 3px;
    text-align: center;
    width:60px;
  }
  .searchBox{
    position:relative;
  }
  .searchBox label{
    width:100px;
  }
  .searchBox>ul{
    position:absolute;
    top:37px;
    width:196px;
    right:0;
    max-height: 150px;
    overflow: auto;
    background-color: white;
    border-right: 5px;
    border: 1px solid #FAEEE9;
  }
  .searchBox>ul>li{
    cursor: pointer;
    padding:5px 0 5px 10px;
  }
  .searchBox>ul>li:hover{
    background-color: #FAEEE9;
  }
</style>
